/* 全局样式区 */
/* 不要写独立样式 */
/* 仅用于覆盖全局生效的样式，独立效果请写在对应页面中 */

:root {
  --header-height: 50px;
  --menu-font-size: 16px;

  --title-font-color: #20232b;
  --body-font-color: #323843;
  --body-bg-color: #f3f3f4;
  --base-bg-color: #fff;

  --main-color: #0052d9;
  --main-success-color: #00A870;
  --main-danger-color: #D54941;
  --main-info-color: #979797;
  --main-warning-color: #ED7B2F;

  --title-height-size: 40px;

  --el-color-primary: var(--main-color);
  --el-color-success: var(--main-success-color);
  --el-color-danger: var(--main-danger-color);
  --el-color-info: var(--main-info-color);
  --el-color-warning: var(--main-warning-color);

  --el-color-primary-light-3: rgba(0, 82, 217, .7);
  --el-color-success-light-3: rgba(0, 168, 112, .7);
  --el-color-danger-light-3: rgba(213, 73, 65, .7);
  --el-color-info-light-3: rgba(231, 231, 231, .7);
  --el-color-warning-light-3: rgba(237, 123, 47, .7);

  --el-color-primary-light-5: rgba(0, 82, 217, .5);
  --el-color-success-light-5: rgba(0, 168, 112, .5);
  --el-color-danger-light-5: rgba(213, 73, 65, .5);
  --el-color-info-light-5: rgba(231, 231, 231, .5);
  --el-color-warning-light-5: rgba(237, 123, 47, .5);

}

.el-menu-item:hover,
.el-sub-menu__title:hover,
.el-menu-item.is-active {
  background: var(--body-bg-color);
}

.el-menu-item.is-active::before {
  position: absolute;
  content: '';
  left: 0;
  top: 12px;
  width: 2px;
  height: 16px;
  opacity: 1;
  border-radius:0px 2px 2px 0px;
  background: var(--main-color);
}

.el-menu-item,
.el-sub-menu__title {
  --el-menu-base-level-padding: 12px;
  height: var(--title-height-size) !important;
  border-radius: 4px;
}

.el-menu--collapse{
  --el-menu-base-level-padding: 8px;
}

@font-face {
  font-family: 'YouSheBiaoTiHei';
  src:
    url('./fonts/YouSheBiaoTiHei.woff2') format('woff2'),
    url('./fonts/YouSheBiaoTiHei.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

body,
html {
  @apply p-0 m-0;
  font-family:
    'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB',
    'Microsoft YaHei', '微软雅黑', Arial, sans-serif;
  color: var(--body-font-color);
  background: var(--body-bg-color);
}

body {
  min-width: 1200px;
  overflow: auto;
}

:focus-visible {
  outline: 0;
}

/* el-button 与 el-menu 兼容 bootstrap-icon 图标 */
.el-menu-item [class^='bi'],
.el-sub-menu [class^='bi'],
.el-menu-item [class^='iconfont'],
.el-sub-menu [class^='iconfont'],
.el-menu-item [class^='el-icon'],
.el-sub-menu [class^='el-icon'] {
  font-size: var(--menu-font-size);
  margin-right: 5px;
  text-align: center;
  vertical-align: middle;
  width: var(--el-menu-icon-width);
}

.el-button [class^='bi'] + span,
.el-button [class^='iconfont'] + span {
  margin-left: 6px;
}

.el-form .el-cascader {
  width: 100%;
}

.el-form--inline .el-input {
  --el-input-width: 180px;
}

.el-form--inline .el-select {
  --el-select-width: 180px;
}

.break-all {
  word-break: break-all;
}

.text-ellipsis {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.el-sub-menu .el-menu-item {
  padding-left: 40px !important;
}
